// require莫格模块的时候，应该在这里得到这个模块的返回值
// 数组里require的模块返回值可以在回调函数的参数里按顺序获取

// 先引入config，使用配置模块的短名称
// 再在回调里去引入需要加载的模块
require(['./config'], () => {
  require(['swiper','template','header','footer'], (Swiper,template,header,footer) => {
    // 这里是当所有要require的模块全部执行结束以后执行的代码
    class Index {
      constructor () {
        this.init()
        this.banner()
        this.category()
        this.getGift()
      }
      init(){
        // $.get('/api/login.php',resp =>{
        //   console.log(resp);          
        // })
      }
      banner () {
        // 实现轮播图
        new Swiper('.lunbo',{
          // direction: 'vertical', // 垂直切换选项
          loop: true, // 循环模式选项
          
          // 如果需要分页器
          pagination: {
            el: '.swiper-pagination',
          },
          autoplay:{
            delay:2000,
            speed:1200
          },
          // 如果需要前进后退按钮
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
          }
        })
      }
      category () {
        $.get('/libs/json/title.json', resp => {
          // console.log(resp)
          // 根据list数据渲染模板
          // template方法有两个参数
          //  第一个参数是定义模板的script标签的id，注意：不加#
          //  第二个参数是模板里所需要的数据，传一个对象： 模板里面需要list，传从后端拿到的resp进去
          // template方法的返回值就是根据模板渲染的html字符串结果
          const str = template('categoryTemplate', { list: resp })
          // console.log(str)
          // 把渲染完成的html字符串放到容器盒子里
          $('#categoryList').html(str)
        })
      }
      getGift(){
        $.get('http://rap2api.taobao.org/app/mock/244732/shoplist',resp=>{
          console.log(resp);
          if(resp.code === 200){
            const {list} = resp.body
            const html = template('cateshop',{list})
            $('#listshop').html(html)
          }
        })
      }
    }
    new Index()
  }) 
})
